@media screen and (max-width: 700px) {
  .crumb {
    font-size: 16px;
    margin-left: 5px;
  }
  body {
    width: 100%;
    min-width: 100%;
    .bar-phone {
      width: 100%;
      clear: both;
      height: 60px;
      background: #fff;
    }
    header,#logo img,#headercontent {
      height: 70px;
    }
    #container {
      aside{
        display: none;
      }
      width: 100%;
      margin-top: 20px;
      #carousel{
        width: 100%;
        height: 300px;
      }
      #practicability {
        display: none;
      }
      #favourite{
        display: none;
      }
    }
    #logo{
      img{
        width: 137px;
        margin-left: 5px;
      }
    }
    #cltitle h1 {
      margin-left: 5px;
      font-size: 16px;
    }
    #top aside {
      display: none;
    }
    #course {
      width: 100%;
    }
    #courselist {
      width: 100%;
    }
    .excitem {
      width: 100%;
      margin-bottom: 20px;
      .coursecover{
        width: 100%;
        border: none;
      }
    }
    #coutsetitle {
      font-size: 14px!important;
    }
    .lesson-slider,.claside {
      display: none;
    }
    .clitem {
     margin-left: 0px!important;
    }
    .excmiddle {
      margin-left: 0px;
    }
    .listcontent{
      width: 100%;
    }
    .articleitem {
      height: 114px;
      clear: both;
      padding: 15px 15px;
      position: relative;
      border-bottom: 1px solid #eee;
    }
    .articleinfo {
      padding-left: 130px;
      h1 {
        width: 90%;
        margin: 0;
        padding: 0;
        font-size:14px!important;
        height: 84px;
        position: relative;
        a.area {
          display: inline-block;
          height: 60px;
          color: #000;
          overflow: hidden;
          text-overflow: ellipsis;
          text-decoration: none;
        }
      }
      div{
        position: relative;
      }
    }
    .articleitem .articlecover {
      height: 115px;
      width: 115px;
      position: absolute;
      top: 15px;
      left: 15px;
    }
    .span-info {
      position: relative!important;
      font-size: 12px!important;
    }

    .articleitem h1 a.area{
      display:inline-block;
      height:60px;
      color:#000;
      overflow:hidden;
      text-overflow: ellipsis;
      text-decoration:none;
    }
    .articleitem h1 span{
      color:#ccc;
      margin-bottom:0;
    }
    .articleitem h1 span a{
      color:#ccc;
    }
    .articleitem h1 span.type a{
      display:inline-block;
      color: #7fbbf9;
      line-height:1;
      padding: 5px;
      border-radius: 3px;
      font-size:1.2rem;
      border: 1px solid #7fbbf9;
      position:relative;
      //top:-7px;
    }
    .otherarticle{
      width: 100%!important;
    }
    .crumbs {
      font-size: 16px;
    }

    .article {
      width: 100%;
      .articlebox{
        padding-left: 5px;
        padding-right: 5px;
        .articlecontent{
          p{
            font-size: 12px;
          }
        }
      }
    }
    nav {
      ul {
        display: none;
      }
    }
    .my-set-div {
      display: inline-block;
    }
  }

}